<template>
<div class="about">
  <el-carousel indicator-position="outside" height="500px">
    <el-carousel-item v-for="item in imgLists" :key="item">
      <img :src="item">
    </el-carousel-item>
  </el-carousel>

  <el-card class="box-card">
<h1>快捷链接：</h1>
        <ul class="jump">
            <li><a href="https://www.bilibili.com/video/BV1kM4y127Li/?spm_id_from=333.1387.favlist.content.click&vd_source=78ab8b1bb2a08198963d505b330856b2" target="_blank">1. 前端web开发HTML 5+CSS3加移动web视频教程，前端web入门首选黑马程序员</a></li>
            <li><a href="https://www.bilibili.com/video/BV16dKHeiE92/?spm_id_from=333.1387.favlist.content.click&vd_source=78ab8b1bb2a08198963d505b330856b2" target="_blank">2.【带小白做毕设】从0开始带小白做SpringBoot3+Vue3的完整实战项目</a></li>
            <li><a href="https://www.bilibili.com/video/BV1rpWjevEip/?spm_id_from=333.1387.favlist.content.click&vd_source=78ab8b1bb2a08198963d505b330856b2" target="_blank">3.【全748集】目前B站最全最细的Python零基础全套教程，2024最新版，包含所有干货！</a></li>
            <li><a href="https://www.bilibili.com/video/BV1Gt411b7Zq/?spm_id_from=333.1387.favlist.content.click&vd_source=78ab8b1bb2a08198963d505b330856b2" target="_blank">4.【4K精品】模拟电子技术基础 上交大 郑益慧主讲（模拟电路/模电 4K超清重制版）</a></li>
            <li><a href="https://www.bilibili.com/video/BV1vvExzFEEK/?spm_id_from=333.1387.favlist.content.click&vd_source=78ab8b1bb2a08198963d505b330856b2" target="_blank">5.【英语六级听力真题】历年最全六级听力原文听完必过！！英语六级听力技巧和方法</a></li>
            <li><a href="https://www.bilibili.com/video/BV1g34y1G72j/?spm_id_from=333.337.search-card.all.click&vd_source=78ab8b1bb2a08198963d505b330856b2" target="_blank">6. vue2最新教程</a></li>        
        </ul>
</el-card>
</div>
</template>

<script>

    export default{
        data(){
            return{
        imgLists:[
            require("@/assets/img/素材1.jpg"),
            require("@/assets/img/素材2.jpg"),
            require("@/assets/img/素材3.jpg"),
            require("@/assets/img/素材4.jpg"),
        ]
        }
    },
    methods:{
       
    },

    }
</script>

<style>
img{
      width:70%;
      height:inherit;
    }
    h1{
      font-size: 25px;
    }
    .jump {
    font-size: 25px;
    align-content:flex-start;
  }
  .jump a{
            font-size: 23px;
            color: black ;
            line-height: 65px;
  }
  a:hover{
            color: skyblue;            
        }
   .box-card {
      width: auto;
      background-color: aliceblue;
  }
</style>
